<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>Sample017 - 渐入式轮播图</title>
		<link rel="stylesheet" type="text/css" href="css/cute.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css" />
	</head>

	<body>
		<!--渐入式轮播核心代码开始-->
		<div id="carousel">
			<ul id="carousel_image_container">
				<li><a href=""><img src="img/1.jpg" alt="img1" /></a></li>
				<li><a href=""><img src="img/2.jpg" alt="img2" /></a></li>
				<li><a href=""><img src="img/3.jpg" alt="img3" /></a></li>
				<li><a href=""><img src="img/4.jpg" alt="img4" /></a></li>
				<li><a href=""><img src="img/5.jpg" alt="img5" /></a></li>
			</ul>
			<ul id="carousel_li_container">
				<li></li>
				<li></li>
				<li></li>
				<li></li>
				<li></li>
			</ul>
			<div id="carousel_controller">
				<span id="carousel_controller_left">&lt;</span>
				<span id="carousel_controller_right">&gt;</span>
			</div>
		</div>
		<!--渐入式轮播核心代码结束-->
	</body>

	<!-- 当页面加载完成，载入JavaScript文件，为Html元素添加动作 -->
	<script src="js/index.js" type="text/javascript" charset="utf-8"></script>

</html>